<template>
  <div>
    <div class="mail-main" :style="{height:$height-100+'px'}">
      <el-tabs v-model="activeName"
               @tab-click="changeTab"
               style="margin-right:40px">
        <el-tab-pane label="客户来源" name="second">
          <sourceList ref="sourceList"/>
        </el-tab-pane>
        <el-tab-pane label="客户信息必填项" name="third">
          <required ref="required"></required>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>
<script>
    import sourceList from '@/components/customer/statistics/source.vue'
    import required from "@/components/customer/required";
    export default {
        name: 'MailAdministration',
        components: {
            sourceList, required
        },
        data() {
            return {
                activeName: 'second'
            }
        },
        mounted() {
            this.$refs.sourceList.init()
        },
        methods:{
            changeTab(tab) {
                switch (tab.name) {
                    case 'second':
                        this.$refs.sourceList.init()
                        break;
                    case 'third':
                        this.$refs.required.init()
                        break;
                }
            }
        }
    }
</script>

<style lang="scss">
  .mail-main {
    padding: 10px 0;
    height: 100%;
    background-color: white;
    font-size: 13px;
    overflow-y: auto;

    .el-tabs__header {
      background-color: #fff;
    }

    .el-tabs__active-bar {
      background-color: #2A97F9 !important;;
    }

    .el-tabs__item.is-active {
      color: #2A97F9 !important;
    }
  }

</style>


